<carousel [(activeSlide)]="activeSlideIndex" >
  <slide *ngFor="let slide of slides; let index=index">
    <img [src]="slide.image" alt="image slide" style="display: block; width: 100%;">

    <div class="carousel-caption">
      <h4>Slide {{index}}</h4>
      <p>{{slide.text}}</p>
    </div>
  </slide>
</carousel>
<br/>
<div>
  <button type="button" class="btn btn-info"
          (click)="addSlide()">Add Slide
  </button>
  <button type="button" class="btn btn-info"
          (click)="removeSlide()">Remove Current
  </button>
  <button type="button" class="btn btn-info"
          (click)="removeSlide(2)">Remove #3
  </button>
</div>
